//转场动画
.slide-right-enter-active,
.slide-right-leave-active,
.slide-left-enter-active,
.slide-left-leave-active,
.slide-opacity-hide-enter-active,
.slide-opacity-show-enter-active
.slide-opacity-show-leave-active,
.slide-opacity-hide-leave-active {
    // 启用硬件加速
  will-change: transform;
  position: fixed;
}
.slide-opacity-show-enter-active,
.slide-opacity-show-leave-active,
.slide-opacity-hide-enter-active,
.slide-opacity-hide-leave-active {
  transition: all 300ms;
}
.slide-right-enter-active,
.slide-right-leave-active,
.slide-left-enter-active,
.slide-left-leave-active{
  transition: all 200ms;
}
body,html,#app{
  overflow-x: hidden;
  background: #fff;
  height: 100vh;
}
html{
  background-color: #F3F3F3;
}
.app-layout-wrapper,.app-layout-wrapper > .page{
 width: 100%;
 height: 100%;
}
.placeholder{
  display: block;
  height: 50px;
}

.van-notify{
  padding-top:50px;
}
.slide-right-enter {
  opacity: 0;
  transform: translate(-100%, 0);
  transition-timing-function:ease-out;
}
.slide-right-leave-active {
  opacity: 0;
  // 安卓手机上同时进行离开和进入会出现闪白现象，暂时不启用离开动画
  transform: translate(100%, 0);
  transition-timing-function:  cubic-bezier(0.5,0,1,1);
}
.slide-left-enter {
  opacity: 0;
  width: 100%;
  transform: translate(100%, 0);
  transition-timing-function:ease-in;
}
.slide-left-leave-active {
  opacity: 0;
  //安卓手机上同时进行离开和进入会出现闪白现象，暂时不启用离开动画
  transition-timing-function:  cubic-bezier(0.5,0,1,1);
  transform: translate(-100%, 0);
}

.slide-opacity-hide-enter {
  opacity: 0;
  transition-timing-function:ease-out;
}
.slide-opacity-hide-leave-active {
  opacity: 0;
  // 安卓手机上同时进行离开和进入会出现闪白现象，暂时不启用离开动画
  transition-timing-function:  cubic-bezier(0.5,0,1,1);
}
.slide-opacity-show-enter {
  opacity: 0;
  width: 100%;
  transition-timing-function:ease-in;
}
.slide-opacity-show-leave-active {
  opacity: 0;
  //安卓手机上同时进行离开和进入会出现闪白现象，暂时不启用离开动画
  transition-timing-function:  cubic-bezier(0.5,0,1,1);
}
html{
  max-width: 32rem;
  margin: 0px auto;
}
